<style>
.mCSB_draggerRail{width: 6px !important;}
.mCSB_container{margin-right: 5px !important;}
</style>
<div id="notif_display" style="display:none;position: absolute;top: 51px;left: 350px;z-index: 1000;width: 310px;height: 250px;">
	<div style="width: 0;height: 0;border-left: 15px solid transparent;border-right: 15px solid transparent;border-bottom: 15px solid #78c4cd;margin-left: 40px;"></div>
	<div class="content ui-corner-all" style="width: 300px;border: 1px solid rgb(120, 196, 205);max-height: 200px;overflow: hidden;background: #fff;padding: 5px 0 5px 5px;">
  		<ul>
  		</ul>
	</div>
</div>
<script type="text/javascript" src="<?php $this->path('js/ui/ui.contextmenu.js');?>"></script>
<script type="text/javascript" src="<?php $this->path('js/jquery.mCustomScrollbar.concat.min.js');?>"></script>
<link href="<?php $this->path('css/jquery.mCustomScrollbar.css');?>" rel="stylesheet" media="all" />
<script>
		var isActive = true;
		$(window).load(function(){
            $(".content").mCustomScrollbar({
				autoHideScrollbar: true,
				advanced:{
					updateOnContentResize: true
				}
			});
			
            $('body').click(function(){
            	$('#notif_display').fadeOut();
            });
            $('#notif_display').click(function(e){
            	e.stopPropagation();
            });
        });
	$(document).ready(function(){	  
        $(window).focus(function() {
			isActive = true;
        }); 
        $(window).blur(function() {
			isActive = false;
        });
		$('.show_notif_list span').text('0').hide();
		<?php if($login->type == ADMIN || $login->type == CASHIER) { ?>
		check_credits();
		check_delivery();
		check_unpaid();
		<?php } ?>
		<?php if($login->type == ADMIN || $login->type == INVENTORY_MANAGER) { ?>
		check_stock();
		check_po();
		<?php } ?>
		if(isActive){
			check_notif(0); //first call
		}
    	setInterval(function(){if(isActive){check_notif(0);}}, 3000);
	});
	
var set_notif = function(type, msg, script, sticky){
	set_notif(type, msg, script, sticky, 0);
};

var set_notif = function(type, msg, script, sticky, all){
	$.post('?module=notification&ajax=1',{setnotif:1, type:type, msg:msg, script:script, sticky:sticky, all:all, action:'<?php echo $this->action;?>'});
};

var check_notif = function(auto){
    $.ajax({
    	type: 'POST',
    	url: '?module=notification&ajax=1',
    	data: {getnotif:1, auto:auto},
    	dataType: 'json',
    	cache: false,
    	success: function(data) {
			if(data.length == 0){
				console.log('empty');
				return;
			}
      		nid = data[0]['nid'];
      		msg = data[0]['msg'];
      		script = data[0]['script'];
      		sticky = (data[0]['sticky']==1?true:false);
      		type = data[0]['type'];
      		action = data[0]['action'];
			if($('div[nid=' + nid + '].toasty').length > 0){
				console.log('exist');
				return;
			}
			var mes = $("<p>" + msg + "</p>");
			if(mes.find('.count_').length > 0){
				count = toNumber(mes.find('.count_').text());
				if(mes.find('.notif_stock').length){
					if(count == toNumber($('.notif_stock').text())){
    					console.log('.notif_stock');
          				set_read_notif(nid);
    					return;
					}else{
						$().toastmessage('removeToast', $('.notif_stock').closest('.toasty'), null);
					}
				}
				if(mes.find('.notif_unpaid').length){
					if(count == toNumber($('.notif_unpaid').text())){
    					console.log('.notif_unpaid');
          				set_read_notif(nid);
    					return;
    				}else{
						$().toastmessage('removeToast', $('.notif_unpaid').closest('.toasty'), null);
					}
				}
				if(mes.find('.notif_paid').length){
					if(count == toNumber($('.notif_paid').text())){
    					console.log('.notif_paid');
          				set_read_notif(nid);
    					return;
    				}else{
						$().toastmessage('removeToast', $('.notif_paid').closest('.toasty'), null);
					}
				}
				if(mes.find('.notif_po').length){
					if(count == toNumber($('.notif_po').text())){
    					console.log('.notif_po');
          				set_read_notif(nid);
    					return;
    				}else{
						$().toastmessage('removeToast', $('.notif_po').closest('.toasty'), null);
					}
				}
				if(mes.find('.notif_delivery').length){
					if(count == toNumber($('.notif_delivery').text())){
    					console.log('.notif_delivery');
          				set_read_notif(nid);
    					return;
    				}else{
						$().toastmessage('removeToast', $('.notif_delivery').closest('.toasty'), null);
					}
				}
			}
			
				console.log(msg);
			if('<?php echo $this->action;?>'.trim() == action.trim()){
    			if(type != 'checkscript'){
    				$.playSound('<?php $this->path('sound/notify');?>');
        			$().toastmessage('showToast', {
        				text     : msg,
        				sticky   : false,
        				type     : type,
    					nid		 : nid
        			});
					$('#notif_display .content ul').prepend(
              			'<li style="border-bottom: 1px solid #e0e0e0;height: 65px;width: 99%;padding: 5px;border-top: 1px solid #fafafa;background: #E2F1F6;">' +
            			'	<strong style="text-transform:capitalize;">' + type + ':</strong><br/>' +
    					'	<span>' + msg + '</span>' +
            			'</li>');
					$('#notif_display .content ul li').find('strong').attr('class', '');
					var p = $('#notif_display .content ul li').length;
					$('.show_notif_list span').text(p).hide().fadeIn();
    			}
                eval(script);
			}
      		set_read_notif(nid);
    	},
    });
};

var set_read_notif = function(nid){
	$.post('?module=notification&ajax=1',{setreadnotif:1,nid:nid});
};
<?php if($login->type == ADMIN || $login->type == CASHIER) { ?>
var check_credits = function(){
		$.post('?module=pos&action=sales&action2=credit&ajax=1',{countoverdue:1}, function(count){
			if(count == 0 || count == toNumber($('.notif_paid').text()))
				return;
			set_notif('notice', "Some customers(<strong class='count_ notif_paid' >" + count + "</strong>) has incur overdue. <a class='toast-close show-list'  href='?module=pos&action=sales&showlist=3' style='display: inline-block;' target='_blank' flag='3'>See</a> list.", "$('.show-list').click(function(e){if(typeof showlist == 'function'){e.preventDefault();showlist($(this).attr('flag'));}});", 1);
		});
};
var check_delivery = function(){
		$.post('?module=pos&action=sales&action2=credit&ajax=1',{countdelivered:1}, function(count){
			if(count == 0 || count == toNumber($('.notif_delivery').text()))
				return;
			set_notif('notice', "Some orders(<strong class='count_ notif_delivery' >" + count + "</strong>) are not yet delivered. <a class='toast-close show-list'  href='?module=pos&action=sales&showlist=5' style='display: inline-block;' target='_blank' flag='5'>See</a> list.", "$('.show-list').click(function(e){if(typeof showlist == 'function'){e.preventDefault();showlist($(this).attr('flag'));}});", 1);
		});
};
var check_unpaid = function(){
		$.post('?module=pos&action=sales&action2=credit&ajax=1',{countunpaid:1}, function(count){
			if(count == 0 || count == toNumber($('.notif_unpaid').text()) )
				return;
			set_notif('notice', "Some orders(<strong class='count_ notif_unpaid' >" + count + "</strong>) are not yet fully paid. <a class='toast-close show-list'  href='?module=pos&action=sales&showlist=2' style='display: inline-block;' target='_blank' flag='2'>See</a> list.", "$('.show-list').click(function(e){if(typeof showlist == 'function'){e.preventDefault();showlist($(this).attr('flag'));}});", 1);
		});
};
<?php } ?>

<?php if($login->type == ADMIN || $login->type == INVENTORY_MANAGER) { ?>
var check_stock = function(){
		$.post('?module=pos&action=inventory&action2=reorder&ajax=1',{countreorder:1}, function(count){
			if(count == 0 || count == toNumber($('.notif_stock').text()))
				return;
			set_notif('notice', "Some items(<strong class='count_ notif_stock' >" + count + "</strong>) has low/empty stock level. <a class='toast-close reorder-item'  href='?module=pos&action=inventory&trans=reorder&keyid=1' style='display: inline-block;' target='_blank'>See</a> list.", "if(typeof refunc_items == 'function'){refunc_items();}", 1);
		});
};
var check_po = function(){
		$.post('?module=pos&action=inventory&action2=reorder&page=receive&ajax=1',{countprocessed:1}, function(count){
			if(count == 0 || count == toNumber($('.notif_po').text()))
				return;
			set_notif('notice', "Some PO(<strong class='count_ notif_po' >" + count + "</strong>) has been approved. <a class='toast-close reorder-list'  href='?module=pos&action=inventory&trans=reorder&keyid=1' style='display: inline-block;' target='_blank'>See</a> list.", "if(typeof refunc_items == 'function'){refunc_items();}", 1);
		});
};
<?php } ?>
var set_read_notif = function(nid){
	$.post('?module=notification&ajax=1',{setreadnotif:1,nid:nid});
};

$('.show_notif_list').click(function(e){
	e.preventDefault();
	e.stopPropagation();
	if($('#notif_display').css('display') != 'none'){
		$('#notif_display').fadeOut();
		return;
	}
	if($('#notif_display .content ul li').length == 0){
		return;
	}
	var top = $(this).offset().top+$(this).height()-10;
	var left = $(this).offset().left-20;
	$('#notif_display').fadeIn('slow').css({top:top+"px", left:left+"px"});
});
</script>;